.login{
  .container{
    width: 1200px;
    margin: 0px auto;
  }
  //顶部区域排版
  .top{
    height: 30px;
    text-align: center;
  }
  //中间登入排版
  .main-by{
    $bg-color:#eff2f7;
    background: #fff;
    padding-bottom: 134px;
    .login-box-wrap{
      box-sizing: border-box;
      height: 528px;
      padding: 89px 0 32px;
      background: $bg-color;
      &::after{
        content: '';
        display: block;
        height: 0px;
        border: 67px solid $bg-color;
        border-width: 67px 50vw 0;
        border-color: $bg-color transparent;
        position: relative;
        top:32px;
      }
      .login-box{
        background: #fff;
        margin: 0 auto;
        height: 405px;
        border: 1px solid #f7f8fa;
        border-radius: 5px;
        box-sizing: border-box;
        padding: 49px 15px;
        display: flex;
        .login-group{
          flex:0 0 695px;
          border-right: 1px solid #ccc;
          .input-group{
            display: block;
            height: 38px;
            box-sizing: border-box;
            border: 2px solid #D7E0EF;
            width: 306px;
            margin: 10px auto;
            border-radius: 4px;
            position: relative;
            span{
              position: absolute;
              line-height: 34px;
              left: 15px;
              font-size: 20px;
            }
            p{
              position: absolute;
              line-height: 34px;
              right: 15px;
              font-size: 20px;
            }
            input::-webkit-input-placeholder{
              color: #B3B3B3;
            }
            input{
              display: block;
              width: 100%;
              box-sizing: border-box;
              border: none;
              outline: none;
              height: 34px;
              font-size: 14px;
              padding-left: 48px;
            }
            .hint{
              position: absolute;
              right: -102px;
              bottom: 6px;
              z-index: 2;
              color: red;
            }
          }
          .grey-border{
            border:2px solid #f1f1f1;
          }
          .code-group{
            border:none;
            .code{
              border:2px solid #eee;
              float:left;
              width: 160px;
              box-sizing: border-box;
              padding-left: 18px;
            }
            .img-code{
              width: 126px;
              height: 34px;
              margin:0 0 0 20px;
              border:2px solid #eee;
              border-radius: 5px;
              float:left;
              text-align: center;
              box-sizing: border-box;
              img{
                width: 100%;
                height: 100%;
              }
            }
          }
          .login-btn-group{
            border: none;
            display: block;
            height: 38px;
            width: 306px;
            background: #ec711f;
            margin: 50px auto 0;
            line-height: 38px;
            color: #fff;
            border-radius: 5px;
            text-align: center;
          }
          .link-group{
            height: 44px;
            font-size: 14px;
            text-align: center;
            line-height: 44px;
            color: #999;
          }
        }
        .login-aside{
          flex:1;
          line-height: 22px;
          padding: 120px 0 0 200px;
          text-align: left;
          p{
            height: 22px;
            font-size: 18px;
            color: #323232;
          }
          .active{
            color: #ff8532;
            cursor: pointer;
          }
        }
      }
    }
  }
  //尾部排版
  .main-ft{
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    color: #ccc;
    background-color: #fff;
    text-align: center;
    border-top: 1px solid #ccc;
  }
}